<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>首页</title>
  <!-- weui -->
  <link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/2.3.0/weui.min.css" />
</head>

<body class="df fdcolum">


  <!-- 主要内容 -->
  <main class="overflow flex">
    <!-- 轮播图 swiper-->
    <div class="swiper-container">
      <div class="swiper-wrapper">
          <div class="swiper-slide">
            <img src="../../assets/imgs/home-lunble1.jpg" alt="">
          </div>
          <div class="swiper-slide">
            <img src="../../assets/imgs/home-lunble2.jpg" alt="">
          </div>
          <div class="swiper-slide">
            <img src="../../assets/imgs/home-lunble3.jpg" alt="">
          </div>
      </div>
      <!-- 如果需要分页器 -->
      <div class="swiper-pagination"></div>
  </div>
    <ul class="mainList container ">
      <li class="first">
        <div class="rank rel ">
          <div class="bre">
            <p class="font20 abs">今日排名</p>
            <p id="rankNum" class="abs"></p>
          </div>
        </div class="bre">
        <div class="cunula rel">
          <div class="bre">
            <p class="abs font18">累计打卡<span id="clockCountVal"></span>天</p>
            <p id="clockBtn" class="abs"></p>
          </div>
        </div>
      </li>
      <li class="second">
        <!-- 运动数据 -->
        <a>
          <div class="sportData rel bre">
            <p class="abs font18">运动数据</p>
          </div>
        </a>
        <div class="sportPrize rel bre">
          <!-- 运动徽章 -->
          <a>
            <div class="bre rel">
              <p class="font18 abs">累计运动徽章</p>
              <p class="abs"><span id="badgesVal"></span>枚</p>
            </div>
          </a>
        </div>
      </li>
      <a>
        <li class="third bre rel">
          <p class="font18 abs">课程训练</p>
        </li>
      </a>
      <a>
        <li class="forth bre rel">
          <p class="abs font18">户外跑步</p>
        </li>
      </a>
    </ul>
  </main>
  <!-- 动态尾部 -->


  <!-- weui -->
  <script src="https://res.wx.qq.com/open/libs/weuijs/1.2.1/weui.min.js" charset="utf-8"></script>

</body>

</html>